<template>
    <div>
       <div class="recommed-title" >热销推荐</div> 
       <ul>
           <router-link tag="li" 
          class="item" v-for="item of list" :key="item.id" :to="'/detail/' + item.id">
             <img class="item-img" :src="item.imgUrl">    
               <div class="item-info">
                  <p class="item-title">{{item.title}}</p>
                 <p class="item-desc">{{item.desc}}</p>
                 <button class="item-buttn">查看详情</button>
             </div> 
           
           </router-link>
       </ul>
    </div>
</template>
<script>
export default {
  name:'HomeRecomd',
  props:{
      list:Array
  },
 
}
</script>
<style lang="stylus" scoped>
@import '~styles/inmist.styl'
.recommed-title
 margin-top :.2rem
 line-height :.8rem
 background :#eee
 text-indent :.2rem
.item
    overflow: hidden
    display :flex 
    height :1.9rem
   .item-img
          width:1.7rem 
          height :1.7rem
          padding :.1rem
    .item-info
        flex :1
        padding :.1rem
        min-width :0
       .item-title
              line-height :.54rem
              font-size :.32rem
              ellipest()
       .item-desc
              line-height :0.4rem
              color :#ccc
              ellipest()
        .item-buttn
              margin-top:.2rem 
              background :#ff9300
              padding :0 .2rem
              border-radius :.06rem
              color :#fff


           
</style>
